<!DOCTYPE html>
<html>

<head>
    <title> 事件</title>
</head>

<body>
  <input type="text" name="" style="border:none;outline:none;background:none">
    <input type='text' id='txt1' />
    <select id='select'>
        <option value='+'>+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
    </select>
    <input type='text' id='txt2' />
    <input type='button' value=' = ' onclick="count()" />
    <!--通过 = 按钮来调用创建的函数，得到结果-->
    <input type='text' id='fruit' />
</body>
<script type="text/javascript">
function count() {
    var value1 = document.getElementById("txt1").value;
    //获取第一个输入框的值
    var value2 = document.getElementById("txt2").value;
    //获取第二个输入框的值
    var sele = document.getElementById("select").value;
    var result = "";
    //获取选择框的值
    //获取通过下拉框来选择的值来改变加减乘除的运算法则
    switch (sele) {
        case "+":
            result = parseFloat(value1) + parseFloat(value2);
            break;
        case "-":
            result = parseFloat(value1) - parseFloat(value2);
            break;
        case "*":
            result = parseFloat(value1) * parseFloat(value2);
            break;
        default:
            result = parseFloat(value1) / parseFloat(value2);
    }
    document.getElementById("fruit").value = result;
    //设置结果输入框的值 
}
</script>

</html>